<template>
    <el-table border :data="data" v-loading="loading">
        <el-table-column align="center" prop="record_time" :label="$i18n.t('RECORD_TIME')"></el-table-column>
        <el-table-column align="center" prop="follow_result" :label="$i18n.t('FOLLOW_RESULT')"></el-table-column>
        <el-table-column align="center" prop="remark" :label="$i18n.t('REMARK')"></el-table-column>
        <el-table-column align="center" prop="operator" :label="$i18n.t('OPERATOR')"></el-table-column>
    </el-table>
</template>

<script>
    import { getLoanedDetail } from '@/api/loaned'

    export default {
        name: 'FollowRecord',
        watch: {
            id () {
                this.loading = true
                getLoanedDetail(this.id, { method: 'LoanedRecord' }).then(res => {
                    const { result } = res
                    this.data = result
                }).finally(() => {
                    this.loading = false
                })
            }
        },
        data () {
            return {
                id: null,
                loading: false,
                data: []
            }
        },
        activated () {
            this.id = this.$route.query.id
        },
        created () {
            this.id = this.$route.query.id
        }
    }
</script>

<style scoped>

</style>
